import React from 'react'
import Header from './components/Header/Header'
import List from './components/List/List'
import Footer from './components/Footer/Footer'

import { useSelector } from 'react-redux'

import './App.css'
export default function App() {
  const todos = useSelector((state) => {
    return state.zs.todos
  })
  return (
    <div className="todo-container">
      <div className="todo-wrap">
        <Header></Header>
        {todos.length ? (
          <div>
            <List></List>
            <Footer></Footer>
          </div>
        ) : (
          <h1>暂无任务</h1>
        )}
      </div>
    </div>
  )
}
